<!DOCTYPE html>
<div class="container-fluid" data-ng-init="init()">
  <h2>Order</h2>
  <p ng-if="itemForm.hasCartItems == false">Your order is empty.</p>
  <form name="inputForm" novalidate angular-validator angular-validator-submit="order()">
    <table ng-if="itemForm.hasCartItems == true" class="table-striped table-bordered top15">
      <tr>
        <th class="col-md-2">
          Title
        </th>
        <th class="col-md-2">
          Author
        </th>
        <th class="col-md-2">
          Unit Price
        </th>
        <th class="col-md-2">
          Quantity
        </th>
      </tr>
      <tr ng-repeat="item in itemForm.items">
        <td class="col-md-2">
          {{item.Book.Title}}
        </td>
        <td class="col-md-2">
          {{item.Book.Author}}
        </td>
        <td class="col-md-2">
          {{item.Book.Price | currency}}
        </td>
        <td class="col-md-2">
          {{item.Quantity}}
        </td>
      </tr>
    </table>
    <div class="row top15">
      <div class="col-md-6">
        <p><b>Total: </b>{{itemForm.Total | currency}}</p>
      </div>
    </div>
    <div class="row top15" ng-if="!status.isSuccess">
      <div class="col-md-6">
        <label for="coupon">Coupon:</label><input type="text" name="coupon" ng-model="itemForm.coupon" maxlength="32"/>
        <button class="btn btn-default" type="submit">Order Now!</button>
      </div>
    </div>
  </form>
  <div class="row top15" ng-if="!status.isSuccess">
    <div class="col-md-6">
      <a class="btn btn-default" ui-sref="cart">Back to Cart</a>
    </div>
  </div>
  <div class="row top5" ng-if="status.isError">
    <div class="col-md-12 text-danger">
      {{status.errorMessage}}
    </div>
  </div>
  <div class="row top5" ng-if="status.isSuccess">
    <div class="col-md-12">
      {{status.successMessage}}
    </div>
  </div>
</div>